<script setup>
import Photoshop from "./Photoshop.vue";
import { ref } from "vue";

const checkboxGroup = ref([]);
const options = [
  {
    key: "options",
    name: "配置",
    disabled: false,
  },
  {
    key: "photoshop",
    name: "图层",
    disabled: false,
  },
  {
    key: "vip",
    name: "会员",
    disabled: true,
  },
];

const onCheckbox = (e) => {
  console.log(e);
};
</script>
<template>
  <Photoshop></Photoshop>
  <footer class="absolute bottom-0">
    <el-checkbox-group
      v-model="checkboxGroup"
      size="small"
      label="配置"
      @change="onCheckbox"
    >
      <el-checkbox-button
        v-for="item in options"
        :key="item.key"
        :label="item.key"
        :disabled="item.disabled"
      >
        {{ item.name }}
      </el-checkbox-button>
    </el-checkbox-group>
  </footer>
</template>
<style lang="scss" scoped></style>
